<style>
    #demo1 > li > a:hover {
        background-color: #009688;
        color: white;
    }

    cite:hover {
        background-color: #009688;
        color: white;
    }

    #header-box {
        float: right;

    }

    #header-box > a {

    }
    body .layui-tree-skin-shihuang .layui-tree-branch{color: green;}

</style>


<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md15">
                    <div class="layui-row layui-col-space15">
                        <div class="layui-col-md12">

                            <div class="layui-card-header">
                                区域管理 &nbsp;&nbsp;<a id="selectMsg" class="layui-badge layui-bg-cyan">选择：</a>

                                <div id="header-box">
                                    <button class="layui-btn  layui-btn-sm" onclick="addCountry()"><i
                                                class="layui-icon ">&#xe654;</i> 新增国家
                                    </button>
                                    <a id="but-box">


                                    </a>


                                </div>
                            </div>

                            <div class="layui-col-md2"
                                 style="display: inline-block; padding: 10px; border: 1px solid #ddd; overflow: auto;">
                                <ul id="demo1"></ul>

                            </div>
                            <div id="bardemo"></div>
                            <table class="layui-col-md6" id="schoolList" lay-filter="schoolList">


                            </table>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>
<!-- 操作列 -->
<script type="text/html" id="oper-col">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="editSchool">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script>
    var startInter = api.school;
    var audio = "t", startTime, endTime;//初始化查询身份为教师,与当前的时间
    var arrTitle = [], school;//标题
    var zone,regionId,regionType;

    $(document).ready(function () {
        dataLoad();
    });

    function table(dat) {
        layui.use(['tree', 'layer'], function () {
            var layer = layui.layer
                , $ = layui.jquery;
            layui.tree({
                elem: '#demo1' //指定元素
               , skin: 'shihuang'
                , target: '_blank' //是否新选项卡打开（比如节点返回href才有效）
                , click: function (item) { //点击节点回调
                    var data = item.data;
                    $("#selectMsg").html("选择："+item.name);
                    console.log(item.type);
                    $("#but-box").children().remove();
                    $("#barDemo").children().remove();
                    if (item.type == 0) {
                        $li = $("<a class=\"layui-btn layui-btn-danger layui-btn-sm\" onclick='delZone(\"" + item.id + "\",\"" + item.name + "\",\""+item.type+"\")'>" + "<span class=\"icon iconfont\">" + "&#xe606;" + "</span>" + "删除" + item.name + "</a>");
                        $nav = $("<a class=\"layui-btn layui-btn-sm\"  onclick='addRegion(\"" + item.id + "\",\"" + item.type + "\")'><i class=\"layui-icon \">&#xe654;</i>新增地区</a>");
                        $("#but-box").append($li);
                        $("#but-box").append($nav);
                    }
                    else {
                        console.log("zhixin ");
                        $li = $("<a class=\"layui-btn layui-btn-danger layui-btn-sm\" id='delRegion' onclick='delZone(\"" + item.id + "\",\"" + item.name + "\",\""+item.type+"\")'>" + "<span class=\"icon iconfont\">" + "&#xe606;" + "</span>" + "删除" + item.name + "</a>");
                        $nav = $("<a class=\"layui-btn layui-btn-sm\" lay-event=\"addSchool\" onclick='addSchool(\"" + item.id + "\")'><i class=\"layui-icon \">&#xe654;</i>新增学校</a>");
                        $("#but-box").append($li);
                        $("#but-box").append($nav);
                    }
                    schoolTable(data);
                }
                , nodes: dat,

            });
        })
    }

    //删除操作
    function delZone(id, name,type) {
        layer.confirm('您确定要删除' + name + "吗？", {
            btn: ['确定', '取消']
        }, function () {
            $.ajax({
                type: "post",
                cache: "false",
                url: startInter,
                data: {
                    action: "delZone",
                    "id": id,
                    "type":type

                },
                dataType: "json",
                success: function (res) {

                    if (res.code == 0) {
                        layer.msg(res.msg,{icon:6});
                        $("#demo1").children().remove();
                        dataLoad();
                        window.location.reload();
                    }
                    else {
                        layer.msg(res.msg,{icon:5});
                    }


                },
                error: function (res) {
                    layer.msg("加载失败");
                }
            })
        })


    }
   //学校表格
    function schoolTable(val) {
        layui.use('table', function () {
            var table = layui.table;
            //展示已知数据
            table.render({
                elem: '#schoolList'
                , cols: [[ //标题栏
                    {field: 'index', title: '序号', fixed: 'left', type: 'numbers', toolbar: "#tableId"}
                    , {field: 'name', title: '学校'}
                    , {field: 'createTime', title: '注册时间', toolbar: "#regesTime"}
                    , {templet: '#oper-col', title: '操作'}
                ]]
                , data: val
                , page: true //是否显示分页
                , limits: [20, 60, 100]
                , limit: 20 //每页默认显示的数量
            });
            //监听工具条
            table.on('tool(schoolList)', function (obj) {
                var data = obj.data;
                var layEvent = obj.event;
                switch (layEvent) {
                    case 'del':
                        layer.confirm('您确定要删除' + data.name + "吗？", {
                            btn: ['确定', '取消']

                        }, function () {
                            $.ajax({
                                type: "post",
                                cache: "false",
                                url: startInter,
                                data: {
                                    action: "delSchool",
                                    "id": data.id,

                                },
                                dataType: "json",
                                success: function (res) {
                                    layer.msg(res.msg);
                                    if (res.code == 0) {
                                        obj.del();
                                        layer.close(index);
                                    }
                                },
                                error: function (res) {
                                    layer.msg("加载失败");
                                }
                            })
                        });
                        break;

                    case 'editSchool':
                        layer.prompt({title: '请修改学校名称，并确认', formType: 3}, function (school, index) {
                            $.ajax({
                                type: "post",
                                cache: "false",
                                url: startInter,
                                data: {
                                    action: "editSchool",
                                    "schoolId": data.id,
                                    "name": school

                                },
                                dataType: "json",
                                success: function (res) {

                                    if (res.code == 0) {
                                        layer.close(index);
                                        layer.msg('修改成功' + "“" + school + "”", {icon: 6});
                                        window.location.reload();
                                    }
                                    else {
                                        layer.msg(res.msg);
                                    }
                                },
                                error: function (res) {
                                    console.log(res);
                                }


                            });
                        });
                        break;

                }


            });
        });
    }
    //新增国家地区
    function addCountry() {
        layer.prompt({title: '输入国家名称，并确认', formType: 3}, function (country, index) {
            layer.close(index);
                $.ajax({
                    type: "post",
                    cache: "false",
                    url: startInter,
                    data: {
                        action: "addCountry",
                        "name": country,
                    },
                    dataType: "json",
                    success: function (res) {
                        if (res.code == 0) {
                            layer.close(index);
                            layer.msg('成功创建' + "“" + country + "”", {icon: 6});
                            $("#demo1").children().remove();
                            dataLoad();
                        }
                        else {
                            layer.msg(res.msg);
                        }
                    },
                    error: function (res) {
                        console.log(res);
                    }


                });

        });

    }
    //新增地区
    function addRegion(id, type) {
        regionId=id;
        regionType=type;
        if(regionId==null){
            layer.msg("未选择国家",{icon:5});
            return false;
        }

        layer.prompt({title: '请输入地区名称，并确认', formType: 3}, function (region, index) {
            layer.close(index);
                $.ajax({
                    type: "post",
                    cache: "false",
                    url: startInter,
                    data: {
                        action: "addRegion",
                        "type": regionType,
                        "name": region,
                        "zid":regionId,

                    },
                    dataType: "json",
                    success: function (res) {
                        if (res.code == 0) {
                            layer.close(index);
                            layer.msg('成功创建' + "“" + region + "”");
                            $("#demo1").children().remove();
                            dataLoad();
                        }
                        else {
                            layer.msg(res.msg);
                        }
                    },
                    error: function (res) {
                        console.log(res);
                    }
                });
        });
    }
    //新增学校
    function addSchool(zoneId) {

        layer.prompt({title: '输入学校名称，并确认', formType: 3}, function (school, index) {

            $.ajax({
                type: "post",
                cache: "false",
                url: startInter,
                data: {
                    action: "addSchool",
                    "zoneId": zoneId,
                    "name": school

                },
                dataType: "json",
                success: function (res) {

                    if (res.code == 0) {
                        layer.close(index);
                        layer.msg('成功创建' + "“" + school + "”");
                        window.location.reload();
                    }
                    else {
                        layer.msg(res.msg);
                    }
                },
                error: function (res) {
                    console.log(res);
                }


            });
        });


    }
    //异步获取数据
    function dataLoad() {
        $.ajax({
            type: "post",
            cache: "false",
            url: startInter,
            data: {
                action: "getSchool",

            },
            dataType: "json",
            success: function (res) {
                table(res.data);
            },
            error: function (res) {
                layer.msg("加载失败");
            }


        })

    }
</script>

<!--//注册时间-->
<script type="text/html" id="regesTime">
    <a style="color: #787878" class="layui-table-link">{{to_date(d.createTime)}}</a>
</script>
